<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>航班查询</title>
    <link rel="stylesheet" href="../../../css/iconfont/iconfont.css">
    <link rel="stylesheet" href="../../../css/index/aircraft/index.css">
    <link rel="stylesheet" href="../../../css/index/hotel/date.css">
    <link rel="stylesheet" href="../../../css/aui.css">
    <link rel="stylesheet" href="../../../css/common/select2.css">
    <link rel="stylesheet" href="../../../css/my/apply.css">
<style>        .select2 {
            width: 10.5rem!important;
            border: 0rem!important;
            font-size: 0.6rem!important;
            color: #73B8D7!important;
        }

        .select2 option {
            color: #73B8D7!important;
            height: 0.5rem!important;
            padding-right: 1rem!important;
        }

        .icon--xunhuanshijian {
            float: left;
            font-size: 1.9rem;
            color: #FFA85E;
            margin-top: -0.5rem;
        }
    </style>
</head>

<body>
    <div class="aui-content">
        <div class="plane_main">
            <div class="hi">HI，</div>
            <div class="plane_str">我们从未停止脚步。</div>
            <div class="search_plane">
                <!--地址选择-->
                <div class="one_way_address" style="overflow: auto;">
                    <div class="one_way_start">
                        <input type="text" name="start" id="ws" value="" readonly onclick="train_addr_left()" placeholder="出发地" style="top:0.15rem;text-align:left;font-size:0.8rem;">
                    </div>
                    <div class="exchange">
                        <div class="line" style="margin-right:-0.2rem;">----</div>
                        <i class="iconfont icon--xunhuanshijian" onclick="exchange()"></i>
                        <div class="line" style="margin-left:-0.2rem;">----</div>
                    </div>
                    <div class="one_way_end">
                        <input type="text" name="end" id="we" value="" readonly onclick="train_addr_right()" placeholder="目的地" style="top:0.15rem;text-align:right;font-size:0.8rem;">
                    </div>
                </div>
                <!--时间选择-->
                <div class="one_way_time date-time">
                    <!-- <i class="iconfont icon-calendar"></i> -->
                    <span style="color:#666666;font-size:1rem;">1月5日</span>
                    <e style="font-size:0.7rem;color:#666666;">今天</e>
                    <span class="time entertime" style="display:none;"></span>
                    <input type="text" class="input-enter none" disabled style="display:none;" />
                </div>
                <div style="width:100%;">
                    <div style="float:left;width:1rem;height:1rem;border-radius:0 50% 50% 0;background:#6BC4EE;margin-left:-1.2rem;"></div>
                    <div style="float:right;width:1rem;height:1rem;border-radius:50% 0 0 50%;background:#6BC4EE;margin-right:-1.2rem;"></div>
                </div>
            </div>
        </div>
        <div class="order_select">
            <div style="border-top: 1px dashed #6CB3D4;padding-top:1.2rem;">
                <div class="one_way_address orderN aui-hide">
                    <!-- <div style="border-bottom:1px dashed #D2EBF5;overflow:auto;"> -->
                    <div class="aui-list-item-label card_side u_ticket" style="width:30%;float:left;height:2.5rem;line-height:2.5rem;color:#2475AA;">
                        <i class="iconfont icon-wendang" style="margin-left:0.2rem;"></i>
                        <span style="font-weight:bold;">申请单号</span>
                    </div>
                    <div class="aui-list-item-input" id="order_travel" style="float: right;height:2.5rem;line-height:2.5rem;width:70%;">
                        <select id="travel_id" class="select2">
                    <option value="-1" selected="selected">请选择申请单号</option>
                  </select>
                    </div>
                    <div style="clear:both;"></div>
                    <div class='traves aui-hide'>
                        <div class="one_way_address " style="border-bottom: 1px dashed #D2EBF5;border-top: 1px dashed #D2EBF5;overflow: auto;">
                            <div class="aui-list-item-label card_side u_ticket" style="width:33%;float:left;height:2.5rem;line-height:2.5rem;color:black;">
                                <i class="iconfont icon-riqi" style="font-size:1.1rem;color:#2475AA;float:left;"></i>
                                <div style="float:left;margin-top:0.05rem;">出行日期</div>
                            </div>
                            <div class="aui-list-item-input start_dt" style="float: right;height:2.5rem;line-height:2.5rem;">

                            </div>
                        </div>
                        <div class="one_way_address " style="border-bottom: 1px dashed #D2EBF5;overflow: auto;">
                            <div class="aui-list-item-label card_side u_ticket" style="width:33%;float:left;height:2.5rem;line-height:2.5rem;color:black;">
                                <i class="iconfont icon-hangcheng3" style="font-size:0.75rem;color:#2475AA;float:left;margin: 0 0.25 rem 0 0.1rem;margin:0 0.15rem;"></i>
                                <div style="float:left;margin:0.05rem 0 0 0.08rem;">行程</div>
                            </div>
                            <div class="aui-list-item-input city" style="float: right;height:2.5rem;line-height:2.5rem;font-size:0.6rem;">

                            </div>
                        </div>
                        <div class="one_way_address" id='travel_order' style="overflow: auto;">
                            <div class="aui-list-item-label card_side u_ticket" style="width:30%;float:left;height:2.5rem;line-height:2.5rem;color:black;">
                                <i class="iconfont icon-ren-copy" style="color:#2475AA;font-size:0.9rem;"></i>
                                <span>出行人</span>
                            </div>
                            <div class="aui-list-item-input peoples" style="float: right;height:2.5rem;line-height:2.5rem;font-size:0.6rem;">

                            </div>
                        </div>
                        <!-- <div class='peoples'></div> -->
                    </div>
                </div>
            </div>
            <div class="aui-btn aui-btn-block" onclick="search()" style="background:#FFA85E;margin-top:1rem;">搜索</div>
            <div style="color:#D9D9D9;text-align:center;margin-top:0.5rem;"><i class="iconfont icon-dunpai" style="font-size:0.8rem;"></i><span style="font-size:0.7rem;">全程预订保障，全靠企管家</span></div>
        </div>

        <!--操作区域-->
        <!-- <div class="operation aui-content-padded"> -->
        <!-- <div style="border-bottom: 1px solid #DCDCDC;overflow: auto;padding:0.3rem 0 0.7rem 0;">
                <div class="aui-list-item-label card_side u_ticket" style="width:30%;float:left;color:black;font-weight:bold;">
                    出行类型
                </div>
                <div class="aui-list-item-input" style="float: right;">
                    <label style="color:#A9A9A9;"><input class="aui-radio order_radio" type="radio" name="order_type"  value="1"> 因公</label>
                    <label style="margin-left:1rem;color:#A9A9A9; "><input class="aui-radio order_radio" checked type="radio" name="order_type" value="0"> 因私</label>
                </div>
            </div> -->



        <!--地址选择-->
        <!-- <div class="one_way_address" style="border-bottom: 1px solid #DCDCDC;overflow: auto;">
                <div class="one_way_start">
                    <input type="text" name="start" id="ws" value="" readonly onclick="train_addr_left()" placeholder="出发地" style="top:0.15rem;">
                </div>
                <i class="iconfont icon-jiaohuanqingqiu" onclick="exchange()" style="font-size:1.65rem;"></i>
                <div class="one_way_end">
                    <input type="text" name="end" id="we" value="" readonly  onclick="train_addr_right()" placeholder="目的地" style="top:0.15rem;">
                </div>
            </div> -->

        <!-- <div class="two_way_time date-time">
                <i class="iconfont icon-calendar"></i>
                <span>1月6日 <e>明天</e></span>


                <span class="time entertime" style="display:none;"></span>
                <input type="text" class="input-enter none" disabled style="display:none;" />
            </div> -->

        <!-- </div> -->
    </div>
</body>

</html>
<script src="../../../script/aui/aui-tab.js"></script>
<script src="../../../script/aui/aui-toast.js"></script>
<script src="../../../script/aui/api.js"></script>
<script src="../../../script/extend/jquery-3.3.1.min.js"></script>
<script src="../../../script/extend/date.js"></script>
<script src="../../../script/widget/js-time.js"></script>
<script src="../../../script/extend/select2.min.js"></script>
<script type="text/javascript" src="../../../script/config.js"></script>
<script type="text/javascript" src="../../../script/common.js"></script>
<script>
    var dataInter = '';
    var isApply, travel_time;
    apiready = function() {
            api.parseTapmode();
            orderType = 1;
            $api.setStorage('order_type', 1);

            // $api.setStorage('order_self', 1);
            //初始化select2
            var areaObj = $("#travel_id").select2();
            areaObj.val(-1).trigger("change");
            areaObj.change();
            //获取出差申请开启状态
            var params = {};
            params.url = Config.common.getCompanyInfo;
            params.data = {};
            ajax(params, function(res) {
                    isApply = res.apply_order;
                    $api.setStorage('isApply', isApply);
                    //暂时去掉因私，初始化为因公，order_type：1，（如果后面加上因私，就把这块去掉）
                    if (isApply === 1) {
                        getApplyList();
                        $('.orderN').removeClass('aui-hide');
                    } else {
                        $('.orderN').addClass('aui-hide');
                    }
                });

                //发送监听事件
            api.addEventListener({
                name: 'cityName'
            }, function(ret, err) {
                var city_on = ret.value.city_on;
                if (orderType == 1) {
                    if (isApply == 1) {
                        //判断选择的城市是否在申请单城市里
                        for (x in dataInter) {
                            if (selected == dataInter[x].travel_application_number) {
                                if (dataInter[x].travel_destination.indexOf(ret.value.cname) != -1 || dataInter[x].travel_site == ret.value.cname) {
                                    if (city_on == 0) {
                                        $('#ws').val(ret.value.cname);
                                    } else {
                                        $('#we').val(ret.value.cname);
                                    }
                                } else {
                                    $alert('该申请单所申请的城市中并不包含当前所选城市，请重新选择');
                                }
                            }
                        }
                    } else {
                        if (city_on == 0) {
                            $('#ws').val(ret.value.cname);
                        } else {
                            $('#we').val(ret.value.cname);
                        }
                    }
                } else {
                    if (city_on == 0) {
                        $('#ws').val(ret.value.cname);
                    } else {
                        $('#we').val(ret.value.cname);
                    }
                }

            });
            //因私因公触发事件
            $('.order_radio').click(function() {
                orderType = $("input[name='order_type']:checked").val();
                if (orderType == 0) {
                    $('#ws').val('');
                    $('#we').val('');
                    var date = new Date();
                    var month = date.getMonth() + 1;
                    var day = date.getDate();
                    $('.one_way_time span').html(month + '月' + day + '日');
                    $api.setStorage('order_self', 1);
                    $('.orderN').addClass('aui-hide');
                    $('.traves').addClass('aui-hide');
                    $api.setStorage('order_type', orderType);
                } else {
                    $('#ws').val('');
                    $('#we').val('');
                    var areaObj = $("#travel_id").select2();
                    areaObj.val(-1).trigger("change");
                    areaObj.change();
                    //判断出差申请单是否开启
                    if (isApply == 1) {
                        $('.orderN').removeClass('aui-hide');
                    } else {
                        $('.orderN').addClass('aui-hide');
                    }
                    $api.setStorage('order_type', orderType);
                }
            })
        }
        //选择申请单事件监听
    selected_staff = [];
    $("#travel_id").change(function() {
        $('#ws').val('');
        $('#we').val('');
        selected = $(this).children('option:selected').text();
        if (selected == '请选择申请单号') {
            $('#ws').val('');
            $('#we').val('');
            $('.traves').addClass('aui-hide');
        }
        if (dataInter != '') {
            for (x in dataInter) {
                if (selected == dataInter[x].travel_application_number) {
                    travel_time = dataInter[x].travel_time;

                    $api.setStorage('travel_time', travel_time);
                    $api.setStorage('oa_number', selected);
                    selected_staff = dataInter[x];
                    // $spi.setStorage('selected_staff',selected_staff);
                    // date_time = dataInter[x].travel_time;
                    // $api.setStorage('aircraf_start_time', dataInter[x].travel_time);
                    // $('.one_way_time span').html(dataInter[x].travel_time.substr(5, 2) + '月' + dataInter[x].travel_time.substr(8, 2) + '日');
                    //根据出行人判断因公因私
                    var user_id = $api.getStorage('user_id');
                    if (dataInter[x].business_traveler.length == 1 && dataInter[x].business_traveler[0].user_id == user_id) {
                        $api.setStorage('order_self', 2);
                    } else {
                        $api.setStorage('order_self', 3);
                    }
                    //处理出差日期
                    var start_date = dataInter[x].travel_time.substr(0, 4) + '-' + dataInter[x].travel_time.substr(5, 2) + '-' + dataInter[x].travel_time.substr(8, 2);
                    //处理出差行程
                    var citys = dataInter[x].travel_site + '-' + dataInter[x].travel_destination;
                    $('.start_dt').text(start_date);
                    $('.city').text(citys);
                    // var travel_html = '';
                    var nameArry = [];
                    $('.peoples').html('');
                    for (var k in dataInter[x].business_traveler) {
                        nameArry.push(dataInter[x].business_traveler[k].user_name);
                        // var mobile = dataInter[x].business_traveler[k].mobile;
                        // var num = parseInt(k) + 1;
                        //   travel_html +=
                        //       `<div class="one_way_address" style="border-bottom: 1px solid #DCDCDC;overflow:hidden;">
                        //     <div class="aui-list-item-label card_side u_ticket" style="width:40%;float:left;height:2.5rem;line-height:2.5rem;color:black;">
                        //         <span style="display:inline-block;text-align:center;line-height:0.8rem; border-radius:50%;width:0.8rem;height:0.8rem;background:#C5C5C5;color:white;margin-left:1rem;margin-right:1rem;">${num}</span><span style="color:#C5C5C5;">${name}</span>
                        //     </div>
                        //     <div class="aui-list-item-input"  style="float: right;height:2.5rem;line-height:2.5rem;color:#C5C5C5;">
                        //       手机号：  ${mobile}
                        //     </div>
                        // </div>`;
                    }
                    $('.traves').removeClass('aui-hide');
                    $('.peoples').append(nameArry.join(','));
                }
            }
        }
    });
    //出行出发城市跳转
    function train_addr_left() {
        if (orderType == 1) {
            if (isApply == 1) {
                if (selected == '请选择申请单号') {
                    $alert('请先选择申请单号');
                    return false;
                }
            }
        }
        city_list(0);
    }
    //出行到达城市跳转
    function train_addr_right() {
        if (orderType == 1) {
            if (isApply == 1) {
                if (selected == '请选择申请单号') {
                    $alert('请先选择申请单号');
                    return false;
                }
            }
        }
        city_list(1);
    }
    //交换地址
    function exchange() {
        var ws = $('#ws').val();
        var we = $('#we').val();
        $('#ws').val(we);
        $('#we').val(ws);
    }
    /*搜索*/
    function search() {
        $api.setStorage('aircraf_start_time', $('.entertime').text());
        $api.setStorage('card_submit_type', 1); //出差类型标识   0火车票   1机票
        var start_site = $api.trim($('#ws').val());
        var end_site = $api.trim($('#we').val());

        var toast = new auiToast({});
        if (start_site.length <= 0 || end_site.length <= 0) {
            $alert('必要参数不可为空');
            return false;
        }
        if (isApply == 1) {
            if (orderType == 1) {
                if ($("#travel_id").find("option:selected").val() == -1) {
                    $alert("出差申请单不可为空");
                    return false;
                }
                if (travel_time.valueOf() > $api.getStorage('aircraf_start_time').valueOf()) {
                    $alert("出行日期需大于等于出差申请单中的申请日期");
                    return false;
                }
            }
        }
        $api.setStorage('aircraf_start_site', start_site);
        $api.setStorage('aircraf_end_site', end_site);

        //打开筛选列表
        api.openWin({
            name: 'ticket_list_win',
            url: './ticket_list_win.html',
            pageParam: {
                selected_staff: selected_staff
            }
        });

    }

    /*打开时间选择*/
    $('.date-time').hotelDate({
        date: 2
    }, function(ret) {
        console.log(ret);
        /*判断是否为今天*/
        $('.one_way_time span').html(ret.train_month + '月' + ret.train_day + '日');
        if (getBeforeDate(0) == ret.enterTime.replace(/\//g, '-')) {
            $('.one_way_time e').empty().append('<e style=""> 今天</e>');
        } else if (getBeforeDate(-1) == ret.enterTime.replace(/\//g, '-')) {
            $('.one_way_time e').empty().append('<e style=""> 明天</e>');
        } else if (getBeforeDate(-2) == ret.enterTime.replace(/\//g, '-')) {
            $('.one_way_time e').empty().append('<e style=""> 后天</e>');
        } else {
            $('.one_way_time e').empty().append('<e style=""> </e>')
        }
        //            将时间存入sessionStorage
        $('.entertime').text(ret.enterTime);
        $api.setStorage('aircraf_start_time', ret.enterTime);

    });

    function city_list(start_end) {
        api.openWin({
            name: 'addr_win',
            url: './addr_win.html',
            pageParam: {
                city_on: start_end
            }
        });
    }

    function getApplyList() {
        //获取出差申请单列表
        var param = {};
        param.url = Config.common.getApplyListOfCurrent;
        param.data = {};
        var html = '';
        ajax(param, function(data) {
            if (data.code == 1) {
                dataInter = data.data;
                for (i in dataInter) {
                    html += '<option value="' + i + '">' + dataInter[i].travel_application_number + '</option>';
                }
                $("#travel_id").append(html);

            } else {
                alert(data.msg);
            }
        });
    }
</script>
